<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div class="container-fluid">
    <link rel="stylesheet" href="/static/dist/lib/chosen/chosen.css">
    <link rel="stylesheet" href="/static/dist/lib/chosenicons/zui.chosenicons.css">
    活动类型添加
    <form id="role-form-add" name="resourceForm" enctype="multipart/form-data" method="post" >
        <input type="hidden" name="id" value="${activityType.id}"/>
        <fieldset>
            <div class="form-group">
                <label class="label">活动类型</label>
                <input type="text" name="name" class="form-control" placeholder="活动类型名称" value="${activityType.name}">
            </div>
            <div class="form-group">
                <label class="label">类型排列</label>
                <input type="number" name="sort" class="form-control" placeholder="活动类型排列" value="${activityType.sort}">
            </div>

            <div class="form-group">
                <label class="label">状态</label>
                <div style="border: 1px solid #ccc; padding: 10px">
                    <div class="switch">
                        <input type="checkbox" name="status" value="0" checked />
                        <label>正常</label>
                    </div>
                </div>
            </div>

            <div class="form-group">
                <label class="label">描述</label>
                <textarea class="form-control" name="remark" rows="3" placeholder="描述">${activityType.remark}</textarea>
            </div>

            <button type="button" class="btn btn-primary" id="activity_type_btn_save">保 存</button>
        </fieldset>
    </form>

    <script src="/static/dist/lib/chosen/chosen.js"></script>
    <script src="/static/dist/lib/chosenicons/zui.chosenicons.js"></script>
    <script type="application/javascript">

        $('input[name=status]').on('click', function () {
            if($(this).prop("checked")) {
                $(this).next().html("正常");
            }else {
                $(this).next().html("停用");
            }
        });
        var status = Number('${activityType.state}');
        if(status == 0){
            $('input[name=status]').next().html("正常");
            $('input[name=status]').prop("checked", true);
        }else{
            $('input[name=status]').next().html("停用");
            $('input[name=status]').prop("checked", false);
        }

        /**
         * 保存按钮
         */
        $('#activity_type_btn_save').on('click', function () {

            var _this = this;
            var data = $('#role-form-add').serializeArray();
            var params = {};
            for (index in data) {
                params[data[index].name] = data[index].value;
            }
            if($('input[name=status]').prop("checked")) {
                params['status'] = 0;
            }else {
                params['status'] = 1;
            }
            $(_this).html('<i class="icon icon-spin icon-spinner-snake"></i>正在保存……')
            $('#resource-form-add fieldset').attr('disabled', true);

            $.post('/admin/activity/type/update', params, function (res) {
                if(res.code == 200 && res.status){
                    new $.zui.Messager('保存成功。', {
                        type: 'success',
                        icon: 'check',//smile
                        close: true,
                        time: 3000,
                        placement: 'center' // 定义显示位置
                    }).show();
                    // 页面跳转
                    $('body').hrefClick('/admin/activity/type/index');
                }else{
                    new $.zui.Messager('保存失败，请检查或修改内容后重试。', {
                        type: 'danger',
                        icon: 'frown',//smile
                        close: true,
                        placement: 'center' // 定义显示位置
                    }).show();
                    $(_this).html('保 存');
                    $('#resource-form-add fieldset').attr('disabled', false);
                }
            });
        });

    </script>
</div>
</body>
</html>